{% extends "./inc/base.html" %}
{% block style %}
<link rel="stylesheet" href="/static/admin/js/zTree/zTreeStyle/zTreeStyle.css" type="text/css">
{% endblock%}
{% block content %}
<section class="vbox">
    <header class="header bg-light dk">
        <p>{{controller.meta_title}}</p>

    </header>
    <section class="scrollable wrapper">

        <div class="row">

            <div class="col-lg-12">
                <form>
                <section class="panel panel-default">
                    <header class="panel-heading">
                        <span class="label bg-danger pull-right m-t-xs">系统检测到,[源栏目]{{source_name}} 与 [目标栏目]{{target_name}} 测在不同的分组设置，请在下面重新选择归类。</span>
                        栏目分组配置
                    </header>
                    <div class="row wrapper">
                        <div class="col-sm-12 m-b-xs">
                            <div class="btn-group" data-toggle="buttons">
                                <label class="btn btn-sm btn-default active radioo" data-tab="1">
                                    <input type="radio" name="options" value="1" checked> 将[源栏目]的分组重新分组到[目标栏目]
                                </label>
                                <label class="btn btn-sm btn-default radioo" data-tab="2">
                                    <input type="radio" name="options" value="2"> 将[源栏目]的分组合并到[目标栏目]
                                </label>
</div>
                        </div>

                    </div>
                    <table class="table table-striped m-b-none" id="tab1" style="display: table">
                        <thead>
                        <tr >
                            <th style="width: 200px">源栏目分组</th>
                            <th>目标栏目分组</th>
                        </tr>
                        </thead>
                        <tbody>
                        {%for v in target_groups%}
                        <tr data-nid="{{v.id}}">
                            <td >
                          {{v.name}}
                            </td>
                            <td>
                                {%for v_ in source_groups%}
                                <label class="checkbox-inline i-checks">
                                    <input type="checkbox" value="{{v_.id}}" name="target" class="target{{v_.id}}" ><i></i> {{v_.name}}
                                </label>
                               {%endfor%}
                            </td>

                        </tr>
                        {% endfor %}
                        </tbody>
                    </table>
                    <table class="table table-bordered  m-b-none" id="tab2" style="display: none">
                        <thead>
                        <tr style="background-color: #f7fafa;">
                            <th style="width: 100px">分组id</th>
                            <th>分组名称</th>
                        </tr>
                        </thead>
                        <tbody>
                        {%for v in target_groups%}
                        <tr data-nid="{{v.id}}" class="active">
                            <td >
                                {{v.id}}
                            </td>
                            <td>
                                {{v.name}}
                            </td>

                        </tr>
                        {% endfor %}
                        {%for v in source_groups%}
                        <tr data-nid="{{v.id}}" class="source_tr" data-name="{{v.name}}" >
                            <td >
                                <input class="form-control form-control-text source_input" value="" placeholder="{{v.id}}">
                            </td>
                            <td>
                                {{v.name}}
                            </td>

                        </tr>
                        {%endfor%}
                        </tbody>
                    </table>
                </section>
                <section class="panel panel-default">
                    <div class="panel-body">


                            <div class="form-group">
                                <div class="col-sm-4 col-sm-offset-2">
                                    <button type="submit"  class="btn btn-primary addbtn">保存</button>
                                    <button type="submit" class="btn btn-default" onclick="javascript:history.back(-1);return false;">返回</button>
                                </div>
                            </div>

                    </div>
                </section>
                </form>
            </div>

        </div>
    </section>
</section>

{% endblock %}

{% block script %}
<script type="text/javascript">

    $(".radioo").click(function () {
       // $(".radioo.active").find("input[name='options']").attr("checked",false);
       // $(this).find("input[name='options']").attr("checked",true);
        var id =$(this).attr("data-tab");
        //console.log(id);
        if(id == 1){
        $("#tab1").show()
            $("#tab2").hide()
        }else {
            $("#tab2").show()
            $("#tab1").hide()
        }
    })
    $(function(){
     $('input[name="target"]').click(function () {
        var cla = "."+$(this).attr("class");
         $(cla).attr("disabled",$(this).is(":checked"));
            $(this).attr("disabled",false);
     })

     $(".addbtn").click(function () {
         var option = $("input[name='options']:checked").val();
         var types =[]
         //console.log(option);
         //return false;
         if(option ==1){
             var tr = $("#tab1>tbody>tr");
             //console.log(tr);
             $.each(tr,function (k, v) {
                 var nid = $(v).attr("data-nid");
                 $.each($(v).find('input[name="target"]:checked'),function (m,n) {
                     var obj ={}
                     obj.oid=$(n).val();
                     obj.nid = nid;
                     types.push(obj);
                 })
             })
             var source_groups = '{{source_g_s|safe}}';
             source_groups = JSON.parse(source_groups);
             //console.log(source_groups);
             // return false;
             if(types.length < source_groups.length){
                 toastr.error('目标栏目所有分组必须归类');
                 return false;
             }
         }else {
          var tr= $(".source_tr");
             $.each(tr,function (k, v) {
                 var obj ={}
                 var nid = $(v).find(".source_input").val()|| $(v).attr("data-nid");
                 var oid = $(v).attr("data-nid");
                 var name = $(v).attr("data-name");
                 obj.nid=nid;
                 obj.oid = oid;
                 obj.name=name;
                 types.push(obj);
             })
         }

         var data = JSON.stringify(types);
         $.ajax({
             url:"/admin/category/moveinfo",
             type:"post",
             data:{data:data,source_id:'{{source_id}}',option:option,merge:"{{controller.get('merge')}}"},
             success:function (data) {
                 if (data.data.url) {

                     toastr.success(data.data.name + ' 页面即将自动跳转~');
                 }else{
                     toastr.success(data.data.name);
                 }
                 setTimeout(function(){
                     if (data.data.url) {
                         location.href=data.data.url;
                     }else{
                         location.reload();
                     }
                 },1500);
             }

         })
         return false;
     })

    })
</script>
{% endblock %}
